/*!
 * TouchSlide v1.1
 * javascript触屏滑动特效插件，移动端滑动特效，触屏焦点图，触屏Tab切换，触屏多图切换等
 * 详尽信息请看官网：http://www.SuperSlide2.com/TouchSlide/
 *
 * Copyright 2013 大话主席
 *
 * 请尊重原创，保留头部版权
 * 在保留版权的前提下可应用于个人或商业用途

 * 1.1 宽度自适应（修复安卓横屏时滑动范围不变的bug）
 */

export default function (a) {
    a = a||{};
    var opts = {
      slideCell:a.slideCell || "#touchSlide", //运行效果主对象，必须用id！，例如 slideCell:"#touchSlide"
      titCell:a.titCell || ".hd li", // 导航对象，当自动分页设为true时为“导航对象包裹层”
      mainCell:a.mainCell || ".bd", // 切换对象包裹层
      effect:a.effect || "left", // 效果，支持 left、leftLoop
      autoPlay:a.autoPlay || false, // 自动播放
      delayTime:a.delayTime || 200, // 效果持续时间
      interTime:a.interTime ||2500, // 自动运行间隔
      defaultIndex:a.defaultIndex ||0, // 默认的当前位置索引。0是第一个； defaultIndex:1 时，相当于从第2个开始执行
      titOnClassName:a.titOnClassName ||"on", // 当前导航对象添加的className
      autoPage:a.autoPage || false, // 自动分页，当为true时titCell为“导航对象包裹层”
      prevCell:a.prevCell ||".prev", // 前一页按钮
      nextCell:a.nextCell ||".next", // 后一页按钮
      pageStateCell:a.pageStateCell ||".pageState", // 分页状态对象，用于显示分页状态，例如：2/3
      pnLoop:a.pnLoop=='undefined '?true:a.pnLoop , // 前后按钮点击是否继续执行效果，当为最前/后页是会自动添加“prevStop”/“nextStop”控制样色
      startFun:a.startFun || null, // 每次切换效果开始时执行函數，用于处理特殊情况或创建更多效果。用法 satrtFun:function(i,c){ }； 其中i为当前分页，c为总页數
      endFun:a.endFun || null, // 每次切换效果结束时执行函數，用于处理特殊情况或创建更多效果。用法 endFun:function(i,c){ }； 其中i为当前分页，c为总页數
      switchLoad:a.switchLoad || null //每次切换效果结束时执行函數，用于处理特殊情况或创建更多效果。用法 endFun:function(i,c){ }； 其中i为当前分页，c为总页數
    };


    var slideCell = document.getElementById(opts.slideCell.replace("#",""));
;
    if( !slideCell ) return false;


    //简单模拟jquery选择器
    var obj = function(str,parEle){

      str = str.split(" ");
      var par = [];
      parEle = parEle||document;
      var retn = [ parEle ] ;
      for( var i in str ){ if(str[i].length!=0) par.push(str[i]) } //去掉重复空格
      for( var i in par ){
        if( retn.length==0 ) return false;
        var _retn = [];
        for ( var r in retn )
        {
          if( par[i][0] =="#" ) _retn.push( document.getElementById( par[i].replace("#","") ) );
          else if( par[i][0] =="." ){

            var tag = retn[r].getElementsByTagName('*');
            for( var j=0; j<tag.length; j++ ){
              var cln = tag[j].className;
              if( cln && cln.search(new RegExp("\\b" + par[i].replace(".","") + "\\b"))!=-1 ){ _retn.push( tag[j] ); }
            }
          }

          else {var tag = retn[r].getElementsByTagName( par[i] ); for( var j=0; j<tag.length; j++ ){ _retn.push( tag[j] ) } }
        }
        retn =_retn;
      }

      return retn.length==0 || retn[0] == parEle ? false:retn;
    }// obj E

    // 创建包裹层
    var wrap = function(el, v){
      var tmp = document.createElement('div');
      tmp.innerHTML = v;
      tmp = tmp.children[0];
      var _el = el.cloneNode(true);
      tmp.appendChild(_el);
      el.parentNode.replaceChild(tmp, el);
      conBox = _el; // 重置conBox
      return tmp;
    };

    // 获取样色數值
    var getStyleVal =function(el, attr){ var v=0; if(el.currentStyle){ v= el.currentStyle[attr] } else { v= getComputedStyle(el,false)[attr]; } return parseInt(v.replace("px","")) }

    // class处理
    var addClass =function(ele, className){
      if (!ele || !className || (ele.className && ele.className.search(new RegExp("\\b" + className + "\\b")) != -1)) return;
      ele.className += (ele.className ? " " : "") + className;
    }

    var removeClass = function(ele, className){
      if (!ele || !className || (ele.className && ele.className.search(new RegExp("\\b" + className + "\\b")) == -1)) return;
      ele.className = ele.className.replace(new RegExp("\\s*\\b" + className + "\\b", "g"), "");
    }

    //全局对象
    var effect = opts.effect;
    var prevBtn = obj( opts.prevCell,slideCell )[0];
    var nextBtn = obj( opts.nextCell,slideCell )[0];
    var pageState = obj( opts.pageStateCell )[0];
    var conBox = obj( opts.mainCell,slideCell )[0];//内容元素父层对象
    if( !conBox ) return false;
    var conBoxSize= conBox.children.length;
    var navObj = obj( opts.titCell,slideCell );//导航子元素结合
    var navObjSize = navObj?navObj.length:conBoxSize;
    var sLoad=opts.switchLoad;

    /*字符串转换*/
    var index=parseInt(opts.defaultIndex);
    var delayTime=parseInt(opts.delayTime);
    var interTime=parseInt(opts.interTime);
    var autoPlay = (opts.autoPlay=="false"||opts.autoPlay==false)?false:true;
    var autoPage = (opts.autoPage=="false"||opts.autoPage==false)?false:true;
    var loop = (opts.pnLoop=="false"||opts.pnLoop==false)?false:true;
    var oldIndex = index;
    var inter=null;// autoPlay的setInterval
    var timeout = null; // leftLoop的setTimeout
    var endTimeout = null;  //translate的setTimeout

    var startX = 0;
    var startY = 0;
    var distX = 0;
    var distY = 0;
    var dist = 0; //手指滑动距离
    var isTouchPad = (/hp-tablet/gi).test(navigator.appVersion);
    var hasTouch = 'ontouchstart' in window && !isTouchPad;
    var touchStart = hasTouch ? 'touchstart' : 'mousedown';
    //var touchMove = hasTouch ? 'touchmove' : 'mousemove';
    var touchMove = hasTouch ? 'touchmove' : '';
    var touchEnd = hasTouch ? 'touchend' : 'mouseup';
    var slideH=0;
    var slideW= conBox.parentNode.clientWidth;// mainCell滑动距离
    var twCell;
    var scrollY ;
    var tempSize = conBoxSize;

    //处理分页
    if( navObjSize==0 )navObjSize=conBoxSize;
    if( autoPage ){
      navObjSize=conBoxSize;
      navObj=navObj[0];
      navObj.innerHTML="";
      var str="";

      if( opts.autoPage==true|| opts.autoPage=="true" ){ for( var i=0; i<navObjSize; i++ ){ str+="<li>"+(i+1)+"</li>" } }
      else{ for( var i=0; i<navObjSize; i++ ){ str+=opts.autoPage.replace("$",(i+1))  } }

      navObj.innerHTML=str;
      navObj = navObj.children;//重置navObj
    }



    if( effect == "leftLoop" ){
      tempSize +=2;
      conBox.appendChild( conBox.children[0].cloneNode(true) );
      conBox.insertBefore( conBox.children[conBoxSize-1].cloneNode(true),conBox.children[0] );
    }
    twCell = wrap(conBox,'<div class="tempWrap" style="overflow:hidden; position:relative;"></div>');
    conBox.style.cssText="width:"+tempSize*slideW+"px;"+"position:relative;overflow:hidden;padding:0;margin:0;";
    for ( var i =0; i<tempSize; i++ ){  conBox.children[i].style.cssText="display:table-cell;vertical-align:top;width:"+slideW+"px"  }


    var doStartFun=function(){ if ( typeof opts.startFun =='function' ){ opts.startFun( index,navObjSize ) } }
    var doEndFun=function(){ if (  typeof opts.endFun =='function' ){ opts.endFun( index,navObjSize ) } }
    var doSwitchLoad=function( moving ){
      var curIndex = ( effect=="leftLoop"?index+1:index ) + moving;
      var changeImg = function( ind ){
        var img = conBox.children[ind].getElementsByTagName("img");
        for ( var i=0; i<img.length ; i++ )
        {
          if ( img[i].getAttribute(sLoad) ){
            img[i].setAttribute("src", img[i].getAttribute(sLoad) );
            img[i].removeAttribute( sLoad );
          }
        }
      }// changeImg E
      changeImg( curIndex );
      if( effect=="leftLoop" ){
        switch ( curIndex )
        {
          case 0: changeImg( conBoxSize );break;
          case 1: changeImg( conBoxSize+1 );break;
          case conBoxSize: changeImg( 0 );break;
          case conBoxSize+1: changeImg( 1 );break;
        }
      }
    }// doSwitchLoad E

    //动态设置滑动宽度
    var orientationChange = function(){
      slideW = twCell.clientWidth;
      conBox.style.width = tempSize*slideW +"px";
      for ( var i =0; i<tempSize; i++ ){  conBox.children[i].style.width=slideW+"px";  }
      var ind = effect == "leftLoop"? index+1:index;
      translate(  -ind*slideW ,0 );
    }
    window.addEventListener("resize", orientationChange, false);


    //滑动效果
    var translate = function( dist, speed, ele ) {
      if( !!ele ){ ele=ele.style; }else{ ele=conBox.style; }
      ele.webkitTransitionDuration =  ele.MozTransitionDuration = ele.msTransitionDuration = ele.OTransitionDuration = ele.transitionDuration =  speed + 'ms';
      ele.webkitTransform = 'translate(' + dist + 'px,0)' + 'translateZ(0)';
      ele.msTransform = ele.MozTransform = ele.OTransform = 'translateX(' + dist + 'px)';
    }

    //效果函數
    var doPlay=function(isTouch){

      switch (effect)
      {
        case "left":
          if ( index >= navObjSize) { index = isTouch?index-1:0; } else if( index < 0) { index = isTouch?0:navObjSize-1; }
          if( sLoad!=null ){ doSwitchLoad(0) }
          translate(  (-index*slideW),delayTime ); oldIndex=index; break;


        case "leftLoop":
          if( sLoad!=null ){ doSwitchLoad(0) }
          translate(  -(index+1)*slideW ,delayTime );
          if ( index==-1){
            timeout= setTimeout( function(){ translate( -navObjSize*slideW ,0 ); }, delayTime );
            index = navObjSize-1;
          }
          else if( index==navObjSize ){ timeout= setTimeout( function(){ translate( -slideW ,0 ); }, delayTime );
            index = 0;
          }
          oldIndex=index;
          break;// leftLoop end

      }//switch end
      doStartFun();
      endTimeout= setTimeout( function(){ doEndFun() }, delayTime );

      //设置className
      for ( var i=0; i<navObjSize; i++ )
      {
        removeClass(navObj[i],opts.titOnClassName);
        if( i == index ){ addClass(navObj[i],opts.titOnClassName) }
      }

      if( loop==false ){ //loop控制是否继续循环
        removeClass( nextBtn,"nextStop" );removeClass( prevBtn,"prevStop" );
        if (index==0 ){ addClass( prevBtn,"prevStop" ) }
        else if (index==navObjSize-1 ){ addClass( nextBtn,"nextStop" ) }
      }
      if(pageState){ pageState.innerHTML= "<span>"+(index+1)+"</span>/"+navObjSize; }

    };// doPlay end

    //初始化执行
    doPlay();

    //自动播放
    if (autoPlay) {
      inter=setInterval(function(){ index++; doPlay() }, interTime);
    }

    //点击事件
    if( navObj ){
      for ( var i=0; i<navObjSize; i++ )
      {
        (function(){
          var j = i;
          navObj[j].addEventListener('click', function(e){ clearTimeout( timeout ); clearTimeout( endTimeout );  index=j; doPlay();  })
        })()

      }
    }
    if(nextBtn){ nextBtn.addEventListener('click', function(e){ if ( loop==true || index!=navObjSize-1 ){ clearTimeout( timeout ); clearTimeout( endTimeout ); index++; doPlay(); } }) }
    if(prevBtn){ prevBtn.addEventListener('click', function(e){ if ( loop==true || index!=0 ){ clearTimeout( timeout ); clearTimeout( endTimeout ); index--; doPlay(); } }) }



    //触摸开始函數
    var tStart = function(e){
      clearTimeout( timeout );clearTimeout( endTimeout );
      scrollY = undefined;
      distX = 0;
      var point = hasTouch ? e.touches[0] : e;
      startX =  point.pageX;
      startY =  point.pageY;

      //添加“触摸移动”事件监听
      conBox.	addEventListener(touchMove, tMove,false);
      //添加“触摸结束”事件监听
      conBox.addEventListener(touchEnd, tEnd ,false);
    }

    //触摸移动函數
    var tMove = function(e){
      if( hasTouch ){ if ( e.touches.length > 1 || e.scale && e.scale !== 1) return }; //多点或缩放

      var point = hasTouch ? e.touches[0] : e;
      distX = point.pageX-startX;
      distY = point.pageY-startY;

      if ( typeof scrollY == 'undefined') { scrollY = !!( scrollY || Math.abs(distX) < Math.abs(distY) ); }
      if( !scrollY ){
        e.preventDefault(); if(autoPlay){clearInterval(inter) }
        switch (effect){
          case "left":
            if( (index==0 && distX>0) || (index>=navObjSize-1&&distX<0 )){ distX=distX*0.4 }
            translate( -index*slideW+distX ,0 );
            break;
          case "leftLoop":translate( -(index+1)*slideW+distX ,0 );break;
        }

        if(  sLoad!=null && Math.abs(distX)>slideW/3 ){
          doSwitchLoad( distX>-0?-1:1 )
        }
      }
    }

    //触摸结束函數
    var tEnd = function(e){
      if(distX==0) return;
      e.preventDefault();
      if( !scrollY )
      {
        if( Math.abs(distX) > slideW/10  ){ distX>0? index--: index++; }
        doPlay( true );
        if (autoPlay) {
          inter=setInterval(function(){ index++; doPlay() }, interTime);
        }
      }

      conBox.removeEventListener(touchMove, tMove, false);
      conBox.removeEventListener(touchEnd, tEnd, false);
    }


    //添加“触摸开始”事件监听
    conBox.addEventListener(touchStart, tStart ,false);


  }// TouchSlide E
//暴露这个插件以便可以使用ES6语法加载
